<script setup lang="ts">
import userApis from '@/apis/user'
import v from '@/plugins/validate'
import storage from '@/utils/storage'
const { useForm, yup, useField } = v
const phoneRegExp = /^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[189]))\d{8}$/
const { handleSubmit, errors } = useForm({
	initialValues: {
		account: '',
		password: '',
	},
	validationSchema: {
		account: yup.string().test({
			name: 'account',
			message: '格式不正确',
			test: value => {
				//复合校验
				if (value) {
					return phoneRegExp.test(value) || yup.string().email().isValid(value)
				}
				return false
			},
		}),
		password: yup.string().min(3, '密码位数不能小于3位数').label('密码'),
	},
})
const { value: account } = useField('account')
const { value: password } = useField('password')
const onSubmit = handleSubmit(async data => {
	const {
		result: { token },
	} = await userApis.login(data)
	console.log(token)
	storage.set('token', { expire: 100, token })
})
</script>
<script lang="ts">
export default {
	route: { name: 'login' }, //自定义一些路由配置
}
</script>

<template>
	auth/login
	<form @submit="onSubmit">
		<input v-model="account" type="text" placeholder="Email" />
		<p>{{ errors.account }}</p>
		<input v-model="password" type="password" placeholder="Password" />
		<p>{{ errors.password }}</p>
		<button type="submit">Login</button>
	</form>
</template>
